<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Avengers End Game Character Showcase</title>
  <link rel="stylesheet" href="./avengers1.css">
</head>

<body>
  <section id="timeline">
    <div class="item">
      <div class="bg" style="background-image: url(./img1.jpg)"></div>
      <div class="year">
        <p>钢铁侠</p>
      </div>
      <div class="content">
        <h1>Anthony Edward Stark</h1>
        <p>
          美国亿万富翁与军火制造商，以他独特的生活方式与其聪明才智及天才发明家，拥有赋予他超人力量，超人耐力，飞行能力与多种武器的动力装甲。
        </p>
      </div>
    </div>

    <div class="item">
      <div class="bg" style="background-image: url(./img2.jpg)"></div>
      <div class="year">
        <p>黑寡妇</p>
      </div>
      <div class="content">
        <h1>Black Widow</h1>
        <p>黑寡妇是一个世界级的运动员，各种技巧性的运动她都没有问题。同时她还是一个格斗专家，会空手道、柔道、自由搏击，除了搏斗技能，她还受过专门的间谍训练，这使得她能轻易侵入敌方，获得重要的情报。“美人计”也是手段之一。</p>
      </div>
    </div>

    <div class="item">
      <div class="bg" style="background-image: url(img3.jpg);"></div>
      <div class="year">
        <p>惊奇队长</p>
      </div>
      <div class="content">
        <h1>Carol Danvers</h1>
        <p>惊奇女士拥有众多超能力，最初包括超于常人的力量和对痛苦的忍耐力，令人敬畏的物理伤害抵御能力，飞行能力和预知能力。后加入复仇者联盟。</p>
      </div>
    </div>

    <div class="item">
      <div class="bg" style="background-image: url(./img4.jpg)"></div>
      <div class="year">
        <p>火箭浣熊</p>
      </div>
      <div class="content">
        <h1>Rocket Raccoon</h1>
        <p>一位被高度机械改造的智能拟人化浣熊， 尽管有时心不甘情不愿，但他仍然是银河护卫队中重要的一员。</p>
      </div>
    </div>
  </section>

</body>

</html>